/**
 * 对31-2.js的优化：用数据去格式化字符串来渲染视图并插入到容器里
 */

var A = A || {};
A.root = document.getElementById('container');
A.formateString = function(str, data) {
    return str.replace(/\{#(\w+)#\}/g, function(match, key) {
        return typeof data[key] === undefined ? '' : data[key];
    });
}
A.strategy = {
    // 文字列表展示，31-3.js。dom操作较多
    'listPart': function() {
        var s = document.createElement('div'),
            ul = '',
            ldata = data.data.li,
            tpl = [
                '<h2>{#h2#}</h2>',
                '<p>{#p#}</p>',
                '<ul>{#ul#}</ul>'
            ].join(''),
            liTpl = [
                '<li>',
                    '<strong>{#strong#}</strong>',
                    '<span>{#span#}</span>',
                '</li>'
            ].join('');
            for(var i = 0, len = ldata.length; i < len; i++) {
                if (ldata[i].em || ldata[i].span) {
                    ul += A.formateString(liTpl, ldata[i]);
                }
            }
            data.data.ul = ul;
            s.innerHTML = A.formateString(tpl, data.data);
            A.root.appendChild(s);
    },
    'codeart': function() {},
    'onlyTitle': function() {},
    'guide': function() {}
}

A.init = function(data) {
    this.strategy[data.type](data);
}
